<template>
	<div>
        <div>
            <Tabs active-key="key1">
                <Tab-pane label="干预模板" key="key1"></Tab-pane>
                <Tab-pane label="随访模板" key="key2"></Tab-pane>
            </Tabs>
        </div>
		<div class="top">
			<Row :gutter="10" justify="center">
				<Col span="4" type="flex" align="right">
					<Button type="success">搜索</Button>
					<Button type="warning">清空</Button>
				</Col>
			</Row>
		</div>

		<Table border :columns="columns12" :data="data6">
			<template :slot-scope="{ row, index }" slot="action">
				<Button type="text" size="small">详情</Button>
				<Button type="text" size="small">发券</Button>
			</template>
		</Table>
		<div class="page">
			<Page :total="100" />
		</div>
	</div>
</template>
<script>
export default {
	data() {
		return {
			columns12: [
				{
					title: '优惠券名称',
					align: 'left',
					key: 'name',
					width: 150
				},
				{
					title: '生效日期',
					align: 'left',
					key: 'date',
					width: 250
				},
				{
					title: '发券数量',
					key: 'total',
					align: 'left',
					width: 150
				},
				{
					title: '领取数量',
					key: 'get',
					align: 'left',
					width: 100
				},
				{
					title: '使用数量',
					align: 'left',
					key: 'used',
					width: 100
				},
				{
					title: '使用数量',
					key: 'unused',
					align: 'left',
					width: 100
				},
				{
					title: '操作',
					align: 'left',
					slot: 'action',
					width: 200
				}
			],
			data6: []
		}
	},
	mounted() {
		this.initTable()
	},
	methods: {
		initTable() {
			const arr = []
			for (let index = 0; index < 10; index++) {
				arr.push({
					name: 'XXX活动购物券',
					date: '2019年10月10日-2019年11月10日',
					total: '300',
					get: '100',
					used: '50',
					unused: '50'
				})
				this.data6 = arr
			}
		}
	}
}
</script>
<style>
/* .ivu-table-wrapper{
    max-width: 100%;
    overflow-y: scroll !important;
} */
.top {
	margin-bottom: 20px;
}
.page {
	margin-top: 20px;
}
</style>
